<template class="body">
  <div>
    <van-nav-bar title="标题" left-arrow @click-left="$emit('close')">
      <template #right>
        <van-icon name="ellipsis" size="25" />
      </template>
    </van-nav-bar>
    <van-cell-group>
      <van-cell title="华语男歌手" is-link />
      <van-cell title="华语女歌手" is-link />
      <van-cell title="华语乐队/组" is-link />
    </van-cell-group>
    <van-cell-group>
      <van-cell title="欧美男歌手" is-link />
      <van-cell title="欧美女歌手" is-link />
      <van-cell title="欧美乐队/组" is-link />
    </van-cell-group>
    <van-cell-group>
      <van-cell title="日本男歌手" is-link />
      <van-cell title="日本女歌手" is-link />
      <van-cell title="日本乐队/组" is-link />
    </van-cell-group>
    <van-cell-group>
      <van-cell title="韩国男歌手" is-link />
      <van-cell title="韩国女歌手" is-link />
      <van-cell title="韩国乐队/组" is-link />
    </van-cell-group>
    <van-cell-group>
      <van-cell title="韩国男歌手" is-link />
      <van-cell title="韩国女歌手" is-link />
      <van-cell title="韩国乐队/组" is-link />
    </van-cell-group>
  </div>
</template>

<script>
export default {
  data () {
    return {}
  },
  created () {},
  mounted () {},
  methods: {}
}
</script>

<style scoped lang="less">
/deep/.van-nav-bar__content {
  background: #e4463b;
}
/deep/.van-nav-bar .van-icon {
  color: #fff;
}
/deep/.van-nav-bar__title {
  color: #fff;
}

/deep/ .van-cell-group {
  margin-top: 20px;
}
.van-cell {
  border-bottom: 1px solid #e3e4e6;
}
</style>
